<template>
  <section>
    <yd-infinitescroll :callback="loadList" ref="infiniteScroll" v-if="floorList.length && floorList.length > 0">
      <div slot="list">
        <floor-item v-for="(floor, index) in floorList" :key="index" :ofloor="floor"></floor-item>
      </div>
      <!-- 数据全部加载完毕显示 -->
      <span slot="doneTip">亲！已经到底了！！再拉就漏喽~~</span>
      <!-- 加载中提示，不指定，将显示默认加载中图标 -->
      <p slot="loadingTip">加载中...</p>
    </yd-infinitescroll>
  </section>
</template>

<script>
  import FloorItem from './floorItem'
  import { apiIndexFloor } from 'js/api'

  export default {
    data() {
      return {
        floorList: [],
        currentPage: 1
      }
    },
    created() {
      this.fetchFloor()
    },
    methods: {
      loadList() {
        this.fetchFloor()
      },
      // 请求首页楼层信息
      fetchFloor() {
        apiIndexFloor(this.currentPage).then(data => {
          const parmData = data || {}
          this.floorList = this.floorList.concat(parmData.floors)
          if (parmData.floors.length === 0) {
            this.$refs.infiniteScroll && this.$refs.infiniteScroll.$emit('ydui.infinitescroll.loadedDone')
            return
          }
          this.$refs.infiniteScroll && this.$refs.infiniteScroll.$emit('ydui.infinitescroll.finishLoad')
          this.currentPage++
        })
      }
    },
    components: {
      FloorItem
    }
  }
</script>

<style lang="scss">
  
</style>